<template>
	<div class="add-jq-dialog">
		<!--初始化主机 弹窗-->
		
		
		<appdialog 
			ref="dialog"
			:visible="false" 
			title="主机初始化"
			@confirm="confirmAdd"
			@cancle="cancleAdd"
			width="500px"
			>
			
			<el-form 
				ref="addForm" 
				:rules="rules" 
				:model="addForm"
				:validate-on-rule-change="false"
				label-width="120px"
				>
			    
				<el-form-item label="用户名"
                        prop="userName">
          <el-input 
          	style="width: 200px;"
          	v-model="addForm.userName"
            :disabled="true"
            size="medium"></el-input>
        </el-form-item>
        
        <el-form-item label="方式：">
         <el-radio-group v-model="addForm.initType" @change="handleChangeMay">
            <el-radio  label="0">密码</el-radio>
            <el-radio  label="1">密钥对</el-radio>
         </el-radio-group>
        </el-form-item>
        
        <el-form-item label="密码：" prop="passWord"  v-show="addForm.initType == '0'">
        	
          <el-input 
          	v-if="!canSee"
          	style="width: 200px;margin-right: 5px;"
          	v-model="addForm.passWord" 
          	size="small" 
          	type="passWord"></el-input>
          <i v-if="!canSee" @click="canSee=true" class="iconfont icon-kejian" style="cursor: pointer;"></i>
          	
          <el-input 
          	v-if="canSee"
          	style="width: 200px;margin-right: 5px;"
          	v-model="addForm.passWord" 
          	size="small" 
          	type="text"></el-input>
          <i v-if="canSee" @click="canSee=false" class="iconfont icon-bukejian" style="cursor: pointer;"></i>
          
        </el-form-item>
        
        <el-form-item label="请输入密钥：" prop="authKey" v-show="addForm.initType == '1'"> 
          <el-input v-model="addForm.authKey" type="textarea"></el-input>
        </el-form-item>
                    
        <el-form-item label="SSH端口："
                      prop="port"
                      style="margin-right: 15px;"
                      >
          <el-input 
          	style="width: 200px;"
          	v-model="addForm.port"
            size="medium"
            value="22"></el-input>
        </el-form-item>

				
			</el-form>
			
			
		</appdialog>
		
		
		
	</div>
</template>

<script>

import appdialog from "@/view/components/dialog/dialog";
//import huanjingStatusSelect from "@/view/components/select/huanjingStatusSelect";
//import nameInput from "@/view/components/input/nameInput";
//import appTextarea from "@/view/components/textarea/textArea";

import {init} from "@/service/swagger/ResourceInitController"

export default {
	name: "addZJDialog",
	components: {
		appdialog,
//		huanjingStatusSelect,
//		nameInput,
//		appTextarea
	},
	data() {
    return {
    	canSee:false,
      addForm : {
      	type : "",
      	authKey: "",
				initType: "0",
				//ip: "192.168.109.103",
				passWord: "",
				port: 22,
				userName: "root",
      },
      rules : {},
      rules1: {
        passWord: [
          { required: true, message: '请输入密码', trigger: 'blur' },
        ]
      },
      rules2: {
        authKey: [
          { required: true, message: '请输入密钥', trigger: 'blur' },
        ]
      },
    }
  },
  mounted() {
  	
  },
	methods:{
		init(opt){
			this.addForm = {
				...this.addForm,
				...opt
			}
			return this ;
		},
   	open(){
   		this.$refs.dialog.open();
   		this.handleChangeMay(0)
   	},
   	handleChangeMay(data){
  		if(data==1){
  			this.rules = this.rules2
  		}else{
  			this.rules = this.rules1
  		}
//			setTimeout(()=>{
//				//console.log(555,this.$refs,this.$refs['addForm'])
//				if(this.$refs.addForm){
//					this.$refs.addForm.clearValidate();
//				}
//			},100)
//			
  		
  		// 
  	},
   	
   	confirmAdd(){
   		console.log("确认添加" , this.addForm )
   		
   		// 验证表单
   		this.$refs.addForm.validate((valid) => {
        if (valid) {
        	// 验证通过
          this.submitAdd();
        } else {
        	setTimeout(()=>{
        		this.open();
        	},50)
          
          return false;
        }
      });
   		// 
   	},
   	submitAdd(){
   		
		  init(this.addForm).then(ret=>{
		  	if(!ret.code){
		  		this.$message({
				     message: '操作成功，开始初始化',
				     type: 'success',
				     duration : 2000,
				  });
				  this.$emit("addSucess")
		  	}
		   	this.$refs.dialog.close();
		  })
   		
   	},
   	cancleAdd(){
   		
   	},
   	zjTtype(name,v){
      	console.log("name改变：",name,v)
   		this.addForm.zjTtype = v ;
		},
		zjName(name,v){
		    console.log("name改变：",name,v)
	   		this.addForm.zjName = v ;
		},
		zjVers(name,v){
		   console.log("name改变：",name,v)
	   		this.addForm.zjVers = v ;
		},
   	changeDESC(name,v){
   		console.log("备注改变：",name,v)
   	},
   	
	}
}
</script>

<style scoped lang="scss">
@import "../../../styles/variables.scss";

</style>